<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8"/>
    <title>ITArmy</title>

    <link rel="icon" type="image/x-icon" href="/static/images/logoIcon.icon">
    <!--<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css" />-->
    <link rel="stylesheet" type="text/css" href="/static/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/static/css/blogArticle.css"/>
    <script type="text/javascript" src="/static/js/jquery-3.4.0.js"></script>
    <script type="text/javascript" src="/static/js/blogArticle.js"></script>
</head>
<body th:style="'background-color : ' + ${session.config.color1}">
<!--顶部导航部分-->
<div class="nav">
    <!--导航居中样式-->
    <div class="navCenter">
        <div class="navLeft">
            <!--logo-->
            <div class="logo">
                <a href="/user/index"><img src="/static/images/logo.png"/></a>
            </div>
            <!--主页-->
            <div class="mainPage"><a href="/user/index">首页</a></div>

            <!--左侧未登录导航-->
            <!--下载App-->
            <div class="download" th:if="${session.user==null}"><a href="">下载App</a></div>
            <!--下载App隐藏部分-->
            <div class="downloadHide">
                <img src="/static/images/QRCode.jpg">
            </div>
            <!--左侧登录后导航将下载App换为关注和消息部分-->
            <!--关注-->
            <div class="attention" th:if="${session.user!=null}"><a href="/focus/focusInformation">关注</a></div>
            <!--消息-->
            <div class="information" th:if="${session.user!=null}"><a href="/message/getCommentMessage">消息</a></div>
            <div th:if="${session.message.all!=0}" style="display: inline-block"><div class="informationIcon" th:text="${session.message.all}"></div></div>

            <!--搜索部分-->

            <div class="search">
                <form action="/serialize/selectBS" method="get">
                    <input type="text" name="name" class="navInput"/>
                    <button class="navBtn" type="submit"><i class="fa fa-search"></i></button>
                </form>
            </div>
        </div>

        <!--<a href="/user/sign">登录</a>-->
        <!--右侧导航-->
        <div class="navRight">
            <!--右侧未登录导航有登录注册部分-->
            <div class="signIn" th:if="${session.user==null}">
                <a href="/user/sign">登录</a>
            </div>

            <!--<ul>-->
            <!--<li><a th:if="${session.user==null}" href="/user/sign">登录</a></li>-->
            <!--<li><a th:if="${session.user!=null}" href="/user/loginOut">退出</a></li>-->
            <!--</ul>-->
            <div class="register" th:if="${session.user==null}"><a href="/user/registerPage">注册</a></div>
            <!--右侧已登录导航有个人信息图片部分-->
            <!--个人信息图片部分-->

            <div th:if="${session.user!=null}" class="myselfPic"><img th:src="${session.user.uHead}">
                <i class="fa fa-sort-down" id="myselfDown"></i>
                <i class="fa fa-sort-up" id="myselfUp"></i>
            </div>
            <!--登录后显示个人信息图片下拉菜单-->
            <ul class="myselfDownList">
                <a href="/user/PersonalPage">
                    <li><i class="fa fa-user"></i> 个人中心</li>
                </a>
                <a href="/user/personalData">
                    <li><i class="fa fa-drivers-license-o"></i> 我的资料</li>
                </a>
                <a href="/user/personalData">
                    <li><i class="fa fa-check-square-o"></i> 我的关注</li>
                </a>
                <a href="/user/personalData">
                    <li><i class="	fa fa-group"></i> 我的粉丝</li>
                </a>

                <li class="loginOut"><i class="fa fa-reply-all"></i> 退出</li>
            </ul>
            <!--写文章按钮-->
            <a href="/test/editor">
                <div class="write">写文章</div>
            </a>

        </div>
    </div>
</div>

<!--主页主体部分-->
<div class="mainPageBody">
    <div class="left">
        <div class="leftUser">
            <div class="leftUserImg">
                <img th:src="${blog.user.uHead}"/>
                <div class="leftUserImgLove0" style="display: inline-block">
                <div class="leftUserImgLove" th:if="!${blog.likeUser}"><span class="love">加关注</span></div>
                <div class="leftUserImgLove1" th:if="${blog.likeUser}"><span class="love">取消关注</span></div>
                </div>
                <input class="leftUserLove" type="hidden" th:value="${blog.likeUser}"/>
                <input class="authorId" type="hidden" th:value="${blog.blog.uId}"/>
                <div class="leftUserName" th:text="${blog.user.uName}">
                </div>
            </div>
        </div>
    </div>
    <div class="right">
        <div class="article">
            <h2 class="articleTitle" th:text="${blog.blog.bTitle}">文章标题</h2>
            <div class="articleinformation">
                <span class="informationText">发布日期:</span><span class="articleTime" th:text="${#dates.format(blog.blog.bTime,'yyyy-MM-dd HH:mm:ss')}" style="color:#858585;font-size: 14px;"></span>
                <span class="informationText"></span><span class="articlePeople" th:text="${blog.user.uName}" style="color:#5140d6; font-size: 15px;"></span>
                 <span class="informationText"style="margin-left: 2%"> 点赞数：</span><span th:text="${blog.likeNumber}"></span>
                <span class="informationText"style="margin-left: 2%"> 评论数：</span><span th:text="${blog.commentNumber}"></span>
                <span class="articleWord" th:text="${blog.blog.bWord}" style="float: right;"></span>
                <span class="informationText"style="float: right;"> 字数：</span>
                <span></span>
            </div> <div class="articleText" th:utext="${blog.blog.bAddress}"></div>
        </div>

            <!--评论区域-->
            <div class="speak">
                <div class="speakInput">
                    <img th:src="${session.user.uHead}" />
                    <textarea type="text" class="textarea" placeholder="想对作者说....." ></textarea>
                </div>
                <div class="showButton">提交评论</div>
                <!--赞了该回答-->
              <div class="agreeAll">
                  <span style="margin-left: 7%">点赞博文</span>
                  <span class="agree" th:if="${blog.like}" >
                      <img class="zan" src="/static/images/zan.png" alt="">
                  </span>
                  <span class="agree" th:if="!${blog.like}" >
                      <img class="zan" src="/static/images/zan2.png" alt="">
                  </span>
                </div>
                <input class="like" type="hidden" th:value="${blog.like}">
                <!--别人的评论区域-->
                <!--<div class="speakOther">-->
                    <!--<img th:src="${session.user.uHead}" />-->
                    <!--<span class="speakName" th:text="${session.user.uName}">评论姓名</span>：-->
                    <!--<div class="speakText">回答内容回答内容回答内容回答内容回答内容回答内容</div>-->

                    <!--<span class="speaktime">(时间)</span>-->
                    <!--<span class="speakreply">回复</span>-->
                <!--</div>-->
                <div class="allSpeakOther">
                    <div class="speakOther" th:each="comment : ${commentMessage}">
                        <img th:src="${comment.user.uHead}" />
                        <span class="speakName" th:text="${comment.user.uName}" >评论姓名</span>：
                        <div class="speakText" th:text="${comment.comment.cAddress}">回答内容回答内容回答内容回答内容回答内容回答内容</div>
                        <span class="speaktime" th:text="${#dates.format(comment.comment.cTime,'yyy-MM-dd HH:mm:ss')}">(时间)</span>
                        <div class="speakReadreply">(查看回复<span>1</span>)
                            <span class="speakreply">回复</span>
                        </div>
                        <!--评论他人的评论-->
                        <div class="speakOtherReply">
                            <img th:src="${comment.user.uHead}" />
                            <span class="speakName" th:text="${comment.user.uName}">评论姓名</span>：
                            <div class="speakText" th:text="${comment.comment.cAddress}">回答内容回答内容回答内容回答内容回答内容回答内容</div>
                            <span class="speaktime" th:text="${#dates.format(comment.comment.cTime,'yyy-MM-dd HH:mm:ss')}">(时间)</span>
                            <span class="speakreply">回复</span><br>
                            <!--<div class="answer" style="display:none;">-->
                                <!--<textarea placeholder="请输入回复内容"></textarea><br>-->
                                <!--<button class="sumit" style="background-color: #2e6da4;color: white;">提交</button>-->
                            <!--</div>-->

                        </div>

                    </div>
                </div>

                <input class="bId"  type="hidden" th:value="${blog.blog.bId}">
                <input class="picture" type="hidden" th:value="${session.user.uHead}">
                <input class="uname" type="hidden" th:value="${session.user.uName}"/>
            </div>
        </div>
    <div class="price">奖励金币+1</div>

</div>
<div class="list">
    <div class="listAgree">
          <span class="agree" th:if="${blog.like}" >
              <img class="zan" src="/static/images/zan.png" alt="" title="点赞">
          </span>
        <span class="agree" th:if="!${blog.like}" >
            <img class="zan" src="/static/images/zan2.png" alt="" title="点赞">
        </span>
    </div>
    <div class="listCollect">
        <input class="collectInput" type="hidden" th:value="${blog.Collection}"/>
        <span class="collect" th:if="!${blog.Collection}">
            <img class="collectImg" src="/static/images/collect1.png" title="收藏">
        </span>
        <span class="collect" th:if="${blog.Collection}">
            <img class="collectImg" src="/static/images/collect2.png" title="收藏">
        </span>
    </div>
    <div class="listTop">
        <a href="#"><i class="fa fa-angle-up" title="返回顶部"></i></a>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/js/canves.js"></script>
</html>